<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
    <title>jQuery Google Charts 1.0 - Demo Site</title>
    <meta http-equiv="Content-Language" content="en-us" />
    <meta name="author" content="Massimiliano Balestrieri" />
    <link rel="stylesheet" type="text/css" href="../../include/css/reset.css" />
    <script src="../../lib/jquery/jquery-1.2.6.min.js" type="text/javascript"></script>
    <script src="../../include/js/lib/ycodaslider-2.0.rc2/lib/jquery-easing-1.3.pack.js" type="text/javascript"></script>
    <script src="../../include/js/lib/ycodaslider-2.0.rc2/lib/jquery.history_remote.pack.js" type="text/javascript"></script>
    <script src="../../include/js/lib/ycodaslider-2.0.rc2/lib/chili/jquery.chili.pack.js" type="text/javascript"></script>
    <script src="../../include/js/lib/ycodaslider-2.0.rc2/ycodaslider-2.0.pack.js" type="text/javascript"></script>
    <script src="../../include/js/lib/ycodaslider-2.0.rc2/plugins/code-ycodaslider-2.0.pack.js" type="text/javascript"></script>
    
    <script src="../../lib/metadata/jquery.metadata.min.js" type="text/javascript"></script>
    
    <script src="../../jgcharts.js" type="text/javascript"></script>
    <script src="../../plugins/table/jgtable.js" type="text/javascript"></script>
    <script src="../../include/js/start-1.0.js" type="text/javascript"></script>
</head>    
<body>
<div id="icone_sinistra">
    <!-- home -->
    <a href="#" class="handle h-docs"><img class="icone_sx" alt="docs" src="../../include/icons/home.png" /></a>
    <a href="#" class="handle h-docs text_icone_sx">Home</a>
    <!-- table -->
    <a href="#" class="handle h-table"><img class="icone_sx" alt="table" src="../../include/icons/frame.png" /></a>
    <a href="#" class="handle h-table text_icone_sx">Table</a>
</div>
<div id="icone_destra">
    <!-- docs -->
    <a href="#" class="handle h-docs"><img class="icone_sx" alt="docs" src="../../include/icons/abc.png" /></a>
    <a href="#" class="handle h-docs text_icone_sx">Docs</a>
    <!-- code -->
    <a href="#" class="handle h-code"><img class="icone_sx" alt="docs" src="../../include/icons/code.png" /></a>
    <a href="#" class="handle h-code text_icone_sx">Code</a>
    <!-- download -->
    <a href="../../jgcharts-0.95.zip"><img class="icone_sx" alt="Download" src="../../include/icons/download.png" /></a>
    <a href="../../jgcharts-0.95.zip" class="text_icone_sx">Download</a>
</div>

<div id="yslider-docs" class="ycodaslider">
    <div class="yslider-panelwrapper" title="jGCharts 1.0">
        <h3>jQuery Google Charts 1.0</h3>
        <p>
        Copyright (c) 2008 Massimiliano Balestrieri<br />
        Examples and docs at: http://maxb.net/blog/<br />
        Licensed GPL licenses:<br />
        http://www.gnu.org/licenses/gpl.html<br />
        </p>
        <blockquote>
        <p>
        
        </p>
        </blockquote>
        <p>
        </p>
        <h4>Basic usage:</h4>
        <div class="code javascript"><!--var api = new jGCharts.Api();
jQuery('<img>')
.attr('src', api.make({data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]]}))
.appendTo("#bar1");--></div>
        <h4>Html:</h4>
        <div class="code html"><!--<div id="bar1"></div>--></div>
        <h4>Basic scripts (use packed version in production):</h4>
        <div class="code html"><!--<script src="jquery-1.2.6.min.js" type="text/javascript"></script>
<script src="jgcharts.js" type="text/javascript"></script>--></div>
    </div>

    <!-- panel -->
    <div class="yslider-panelwrapper" title="Bar">
        
        <h4>Basic Bar</h4>
        <div class="code javascript"><!--//1 ) api
var api = new jGCharts.Api();        

//2) options
var opt = {
    data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]]//mandatory 
};//set options 

//3) append Img (with jQuery)
jQuery('<img>')
.attr('src', api.make(opt))//options 
.appendTo("#bar1");--></div>
        
        <div id="bar1"></div>
        
    </div>

    
    <!-- bar options -->


    <div class="yslider-panelwrapper" title="Bar Options">
        
        <h4>Schema</h4>
        <div class="code javascript"><!--//1 ) api
var api = new jGCharts.Api();        
//2) options
var opt = {};//set options 
//3) append img
jQuery('<img>')
.attr('src', api.make(opt))//options 
.appendTo("#chart_container");
--></div>
        <h3>Options</h3>
        <h4>Chart Dimension</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory 
size : '400x400'//default 300x200 (width x height) - maximum size 300,000 pixels
}--></div>
        <div id="bar2"></div>
                
        <h4>Direction</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory 
type : 'bhg'//default bvg
}--></div>
        <div id="bar3"></div>
        
        <h4>Legend and axis labels</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory 
axis_labels : ['2008','2007','2006'], //default 0,1,2 etc...
legend : ['serie1', 'serie2', 'serie3'] //default none
}--></div>
        <div id="bar4"></div>
        
        <h4>Dimensions and spacing</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory 
bar_width : 10, //default 20
bar_spacing : 10 //default 1
}--></div>
        <div id="bar5"></div>
        
        <h4>Colors</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory 
colors : ['4b9b41','81419b','41599b']
}--></div>
        <div id="bar6"></div>
        
        <h4>Background - solid</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory 
bg   : 'e0e0e0'//default false
//bg_trasparency : 50 - default false - also chbg_trasparency
}--></div>
        <div id="bar7"></div>

        <h4>Background - gradient</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory 
bg        : 'FFFFFF',//default false
bg_offset : '000000',
bg_angle  : '45',//default 90   
bg_type   : 'gradient' //default solid
}--></div>
        <div id="bar8"></div>
        
        <h4>Background - stripes</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory 
bg        : 'FFFFFF',//default false
bg_offset : 'e0e0e0',
bg_angle  : '0',//default 90   
bg_type   : 'stripes', //default solid
bg_width  : '10'//default 10 - min 10
}--></div>
        <div id="bar9"></div>
        
        <h4>Chart Area Background (like bg)</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory 
chbg        : 'FFFFFF',//default false
chbg_offset : '4b9b41',
chbg_angle  : '45',//default 90   
chbg_type   : 'gradient' //default solid
}--></div>
        <div id="bar10"></div>
        
        
        
        <h4>Title</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory 
title       : 'Bar Chart', //default false
title_color : 'a98147',
title_size  : 20 //default 10
}--></div>
        <div id="bar11"></div>
        
        <h4>Grid</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory 
grid        : true, //default false
grid_x      : 5,    //default 10
grid_y      : 5,    //default 10
grid_line   : 5,   //default 10
grid_blank  : 0    //default 0
}--></div>
        <div id="bar12"></div>
        
    </div>
    
    <!-- stacked -->
    

    <div class="yslider-panelwrapper" title="Stacked Bar">
                    
        <h4>Horizontal Dataset Stacked</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory 
type : 'bhs'//default bvg
}--></div>
        <div id="stacked1"></div>
        
        <h4>Vertical Dataset Stacked</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory 
type : 'bvs'//default bvg
}--></div>
        <div id="stacked2"></div>

    </div>    


    <!-- line -->


    <div class="yslider-panelwrapper" title="Line">
        <div id="line1"></div>
        <h4>Js</h4>
        <div class="code javascript"><!--var api = new jGCharts.Api();
jQuery('<img>')
.attr('src', api.make({
data : [[105.7,97.9],[108.1,101.6],[110.7,102.9],[111.0,93.7],[110.0,89.8],[109.0,90.7],
[107.5,93.0],[106.1,94.5],[104.3,91.9],[102.0,93.9],[102.8,93.6],[103.8,92.6],
[102.9,94.0],[102.1,92.7],[100.6,96.0],[101.7,97.9],[101.8,105.0],
[103.3,104.1],[104.0,105.1],[103.7,108.1],[108.4,108.4],[109.4,113.8],
[112.0,109.1],[112.6,106.3],[115.5,106.7],[115.7,108.8],[114.7,118.8],
[115.9,120.4],[116.2,115.9],[118.0,124.7],[123.3,126.5],[127.6,131.6],
[130.3,134.0],[135.5,135.7],[138.2,126.4],[139.6,127.4],[145.1,131.0],
[146.4,129.9],[147.1,133.7],[149.0,138.4],[150.3,141.0],[151.3,139.3],
[153.4,145.3],[152.7,142.9],[152.9,129.2],[152.2,126.0],[151.9,124.8],
[150.1,125.9],[148.2,118.9],[145.3,122.9],[142.9,127.7],[142.6,134.4],
[144.0,138.5],[145.5,138.7],[147.2,141.8],[150.0,139.2],[153.8,145.6],
[155.4,147.6],[157.0,157.9],[158.4,156.2],[162.8,153.9],[162.8,158.6],
[164.7,166.3],[168.5,165.8]] //MANDATORY
type : lc 
}))
.appendTo("#line1");--></div>
    </div>
    
    <!-- line options -->
    <div class="yslider-panelwrapper" title="Line Options">

        <h4>Other options</h4>
        <p>See bar options for legend, axis, grid, background, colors etc....</p>
                
        <h4>Schema</h4>
        <div class="code javascript"><!--//1 ) api
var api = new jGCharts.Api();    
//2) options
var opt = {};//set options 
//3) append img
jQuery('<img>')
.attr('src', api.make(opt))//options 
.appendTo("#chart_container");--></div>

        <h4>Fillarea</h4>
        <div class="code javascript"><!--{
data : [[105.7,97.9] //...[etc] 
type : 'lc',
fillarea : true //default false
}--></div>
        <div id="line2"></div>

        <h4>FillBottom</h4>
        <div class="code javascript"><!--{
data : [[105.7,97.9] //...[etc] 
type : 'lc',
fillarea : true, //default false
fillbottom : true //default false
}--></div>
        <div id="line3"></div>

        <h4>FillTop</h4>
        <div class="code javascript"><!--{
data : [[105.7,97.9] //...[etc] 
type : 'lc',
fillarea : true, //default false
fillbottom : true, //default false
filltop : true //default false
}--></div>
        <div id="line4"></div>

        <h4>Line options</h4>
        <div class="code javascript"><!--{
data : [[105.7,97.9] //...[etc] 
type : 'lc',
lines: [[4,2,2],[6,3,3]] 
//[line width, solid width, blank width], [serie2N,serie2N,serie2N] - default false 
}--></div>
        <div id="line5"></div>

        <h4>Axis step</h4>
        <div class="code javascript"><!--{
data : [[105.7,97.9] //...[etc] 
axis_labels : ['01-03','02-03','03-03'// ... [etc]
axis_step : 10, 
type : 'lc'
}--></div>
        <div id="line6"></div>    
        
        <h4>Sparklines</h4>
        <p>A sparkline chart has exactly the same parameters as a line chart. The only difference is that the axes lines are not drawn for sparklines by default. You can add axes labels if you wish. (Google Api)</p>
        <div class="code javascript"><!--{data : [[105.7,97.9] //...[etc] 
type : 'ls'
}--></div>
        <div id="line7"></div>        
    </div>
    
    
    <!-- pie -->
    
    <div class="yslider-panelwrapper" title="Pie">
        
        <h4>Pie</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory 
type : 'p'//default bvg
}--></div>
        <div id="pie1"></div>
        
    </div>
    
    <div class="yslider-panelwrapper" title="Pie 3d">
        
        <h4>Pie</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]],//mandatory 
type : 'p3',//default bvg
size : '400x200'
}--></div>
        <div id="p3d1"></div>
        
    </div>
    
    <!--gallery -->
    
    <div class="yslider-panelwrapper" title="Charts gallery">
        <h4>Horizontal Stacked Bar</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]], 
//source
legend      : ['Data 1','Data 2','Data 3'],
axis_labels : ['2001','2002','2003'],
                        
//options 
size        : '400x250',
type        : 'bhs',
colors      : ['2c50f2','FFCC00','99CC00'],

//bar
bar_width   : 50,
bar_spacing : 5,

//bg
bg          : 'FFFFFF',
bg_type     : 'gradient',
bg_angle    : 90,
bg_offset   : '8c8c8c',

//grid
grid        : true,
grid_x      : 5,
grid_y      : 5,
grid_line   : 5,
grid_blank  : 5
}--></div>
        <div id="gallery1"></div>
        <h4>Vertical Stacked Bar</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]], 

//source
legend      : ['Data 1','Data 2','Data 3'],
axis_labels : ['2001','2002','2003'],
                        
//options 
size        : '250x400',
type        : 'bvs',

//bar
bar_width   : 50,
bar_spacing : 5,

//bg
chbg          : 'FFFFFF',
chbg_type     : 'gradient',
chbg_angle    : 90,
chbg_offset   : '8c8c8c',

//grid
grid        : true,
grid_x      : 5,
grid_y      : 5,
grid_line   : 5,
grid_blank  : 0

}--></div>
        <div id="gallery2"></div>
        <h4>Horizontal Bar</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]], 

//source
legend      : ['Data 1','Data 2','Data 3'],
axis_labels : ['2001','2002','2003'],
                        
//options 
size        : '250x400',
type        : 'bhg',

//bar
bar_width   : 50,
bar_spacing : 5,

//bg
chbg          : '000000',
chbg_trasparency: 20

}--></div>
        <div id="gallery3"></div>
        <h4>Vertical Bar</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]], 

//source
legend      : ['Data 1','Data 2','Data 3'],
axis_labels : ['2001','2002','2003'],
                        
//options 
size        : '400x250',
type        : 'bvg',
colors      : ['4b9b41','81419b','41599b'],
//bar
bar_width   : 20,
bar_spacing : 5,

//style
bg          : 'ffffff',
bg_type     : 'stripes',
bg_angle    : 90,
bg_offset   : '999999',
bg_width    : 20,
}--></div>
        <div id="gallery4"></div>
        <h4>Vertical Bar</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]], 

//source
legend      : ['Data 1','Data 2','Data 3'],
axis_labels : ['2001','2002','2003'],
                        
//options 
size        : '400x250',
type        : 'bvg',

//bar
bar_width   : 10,
bar_spacing : 10,

//style
chbg          : 'ffffff',
chbg_type     : 'stripes',
chbg_angle    : 90,
chbg_offset   : '999999',
chbg_width    : 20,
}--></div>
        <div id="gallery5"></div>
        <h4>Line chart</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]], 

//source
legend      : ['Data 1','Data 2','Data 3'],
axis_labels : ['2001','2002','2003'],
                        
//options 
size        : '400x250',
type        : 'lc',

//style
chbg          : 'ffffff',
chbg_type     : 'stripes',
chbg_angle    : 90,
chbg_offset   : '999999',
chbg_width    : 20,

bg            : 'ffffff',
bg_type       : 'gradient',
bg_angle      : 45,
bg_offset     : '4b9b41',
bg_width      : 20

}--></div>
        <div id="gallery6"></div>
        <h4>Line chart</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]], 
          
//source
//legend      : ['Data 1','Data 2','Data 3'],
axis_labels : ['2001','2002','2003'],
                        
//options 
size        : '400x250',
type        : 'lc',

//style
fillarea    : true,
fillbottom  : true,
filltop     : true,
 
//series line 
lines       : [[3,3,3],[4,4,4],[5,5,5]],

bg            : 'ffffff',
bg_type       : 'gradient',
bg_angle      : 45,
bg_offset     : '81419b',
bg_width      : 20

}--></div>
        <div id="gallery7"></div>
        <h4>Pie</h4>
        <div class="code javascript"><!--{
data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]], 
//source
legend      : ['Data 1','Data 2','Data 3'],
axis_labels : ['2001','2002','2003'],
                        
//options 
size        : '400x250',
type        : 'p',

bg            : '999999',
bg_type       : 'gradient',
bg_angle      : 45,
bg_offset     : 'ffffff',
bg_width      : 20
}--></div>
        <div id="gallery8"></div>
        <h4>Pie 3d</h4>
        <div class="code javascript"><!--{
   data : [[153, 60, 52], [113, 70, 60], [120, 80, 40]], 
   //source
   legend      : ['Data 1','Data 2','Data 3'],
   axis_labels : ['2001','2002','2003'],

   //options 
   size        : '400x200',
   type        : 'p3',
   
   bg            : 'ffffff',
   bg_type       : 'gradient',
   bg_angle      : 45,
   bg_offset     : '999999',
   bg_width      : 20
}--></div>
        <div id="gallery9"></div>
        
    </div>
    <!--credits -->
    
    <div class="yslider-panelwrapper" title="Credits">
        <h4>Credits</h4>
        <p>
        Google Chart Api - <a href="http://code.google.com/apis/chart/" class="blank">http://code.google.com/apis/chart/</a>
        </p>     
        <h4>Libraries</h4>
        <p>
        jquery v1.2.6 of John Resig <a href="http://jquery.com" class="blank">jquery.com</a><br />
        </p>
        <h4>Demo Libraries (YCodaSlider 2.0)</h4>
        <p>
        jquery history_remote v1.0.3 of Klaus Hartl <a href="http://stilbuero.de" class="blank">stilbuero.de</a><br />
        jquery easing v1.3 of George McGinley Smith<br />
        jquery.chili-1.9.js of <a href="http://noteslog.com/chili/" class="blank">Andrea Ercolino</a><br />
        </p>
        <h4>This Demo</h4>
        <p>
        Icons <a class="blank" href="http://www.icon-king.com/?p=15">Nuvola</a><br />
        Yahoo Css Reset version: 2.5.1
        GreyBox <a href="http://jquery.com/demo/grey/">Css</a>
        </p>
    </div>
</div>    

<div id="yslider-table" class="ycodaslider">

    <div class="yslider-panelwrapper" title="jGTable 1.0">
    
        <h3>jQuery Google Charts Table 1.0</h3>
        <p>
        Copyright (c) 2008 Massimiliano Balestrieri<br />
        Examples and docs at: http://maxb.net/blog/<br />
        Licensed GPL licenses:<br />
        http://www.gnu.org/licenses/gpl.html<br />
        </p>
        <blockquote>
        <p>
        
        </p>
        </blockquote>
        <p>
        </p>
        <h4>Basic usage:</h4>
        <div class="code javascript"><!--jQuery(".jgtable").jgtable();--></div>
        <h4>Html (see class="serie"):</h4>
        <div class="code html"><!--<table class="jgtable">
  <thead>
    <tr>
        <th>Anno</th>
        <th class="serie">Data 1</th>
        <th class="serie">Data 2</th>
        <th class="serie">Data 3</th>
    </tr>
  </thead>
  <tbody>
    <tr>
        <th class="serie">2001</th>
        <td>153</td>
        <td>60</td>
        <td>52</td>
    </tr>
    <tr>
        <th class="serie">2002</th>
        <td>113</td>
        <td>70</td>
        <td>60</td>
    </tr>
    <tr>
        <th class="serie">2003</th>
        <td>120</td>
        <td>80</td>
        <td>40</td>
    </tr>
  </tbody>
</table>--></div>
        <h4>Basic scripts (use packed version in production):</h4>
        <div class="code html"><!--<script src="jquery-1.2.6.min.js" type="text/javascript"></script>
<script src="jquery.metadata.min.js" type="text/javascript"></script>
<script src="jgcharts.js" type="text/javascript"></script>
<script src="plugins/table/jgtable.js" type="text/javascript"></script>--></div>

    </div>
    
    <div class="yslider-panelwrapper" title="Basic">
    
        <table class="jgtable">
          <thead>
            <tr>
                <th>Anno</th>
                <th class="serie">Data 1</th>
                <th class="serie">Data 2</th>
                <th class="serie">Data 3</th>
            </tr>
          </thead>
          <tbody>
            <tr>
                <th class="serie">2001</th>
                <td>153</td>
                <td>60</td>
                <td>52</td>
            </tr>
            <tr>
                <th class="serie">2002</th>
                <td>113</td>
                <td>70</td>
                <td>60</td>
            </tr>
            <tr>
                <th class="serie">2003</th>
                <td>120</td>
                <td>80</td>
                <td>40</td>
            </tr>
          </tbody>
        </table>
        
        <div class="code javascript"><!--jQuery(".jgtable").jgtable();--></div>
        <div class="code html"><!-- <table class="jgtable">
  <thead>
    <tr>
        <th>Anno</th>
        <th class="serie">Data 1</th>
        <th class="serie">Data 2</th>
        <th class="serie">Data 3</th>
    </tr>
  </thead>
  <tbody>
    <tr>
        <th class="serie">2001</th>
        <td>153</td>
        <td>60</td>
        <td>52</td>
    </tr>
    <tr>
        <th class="serie">2002</th>
        <td>113</td>
        <td>70</td>
        <td>60</td>
    </tr>
    <tr>
        <th class="serie">2003</th>
        <td>120</td>
        <td>80</td>
        <td>40</td>
    </tr>
  </tbody>
</table>--></div>
    </div>
    
    <div class="yslider-panelwrapper" title="Metadata">
    
        
            <div class="example">
            <h3>Example 1</h3>
            <div class="code javascript"><!--jQuery(".jgtable").jgtable();--></div>
            <div class="code html"><!--<table class="jgtable {size:'550x400',
type:'bhg',
title:'Example 1',
title_color:'000000',
title_size:16,
bar_width:30,
bar_spacing:2,
colors:['5131c9','FFCC00','da1b1b'],
bg:'FFFFFF',
bg_type:'gradient',
bg_angle:90,
bg_offset:'6d6969',
grid:true,
grid_x:7,
grid_y:10,
grid_line:0,
grid_blank:0}">--></div>
                                                
            <table class="jgtable {size:'550x400',
                                                type:'bhg',
                                                title:'Example 1',
                                                title_color:'000000',
                                                title_size:16,
                                                bar_width:30,
                                                bar_spacing:2,
                                                colors:['5131c9','FFCC00','da1b1b'],
                                                bg:'FFFFFF',
                                                bg_type:'gradient',
                                                bg_angle:90,
                                                bg_offset:'6d6969',
                                                grid:true,
                                                grid_x:7,
                                                grid_y:10,
                                                grid_line:0,
                                                grid_blank:0}">
              <thead>
                <tr>
                    <th>Anno</th>
                    <th class="serie">Data 1</th>
                    <th class="serie">Data 2</th>
                    <th class="serie">Data 3</th>
                </tr>
              </thead>
              <tbody>
                <tr>
                    <th class="serie">2001</th>
                    <td>153</td>
                    <td>60</td>
                    <td>52</td>
                </tr>
                <tr>
                    <th class="serie">2002</th>
                    <td>113</td>
                    <td>70</td>
                    <td>60</td>
                </tr>
                <tr>
                    <th class="serie">2003</th>
                    <td>120</td>
                    <td>80</td>
                    <td>40</td>
                </tr>
              </tbody>
            </table>
            </div>
            <div class="example">
            <h3>Example 2</h3>
            <div class="code javascript"><!--jQuery(".jgtable").jgtable();--></div>
            <div class="code html"><!--<table class="jgtable {size:'400x500',
type:'bvg',
title:'Example 2',
title_color:'c81e3d',
title_size:16,
bar_width:30,
bar_spacing:2,
colors:['1aa22f','FFCC00','da1b1b'],
bg:'FFFFFF',
bg_type:'stripes',
bg_angle:90,
bg_offset:'b7b4b4',
bg_width:10,
chbg:'000000',
chbg_type:'solid'}">--></div>
            <table class="jgtable {size:'400x500',
                                                type:'bvg',
                                                title:'Example 2',
                                                title_color:'c81e3d',
                                                title_size:16,
                                                bar_width:30,
                                                bar_spacing:2,
                                                colors:['1aa22f','FFCC00','da1b1b'],
                                                bg:'FFFFFF',
                                                bg_type:'stripes',
                                                bg_angle:90,
                                                bg_offset:'b7b4b4',
                                                bg_width:10,
                                                chbg:'000000',
                                                chbg_type:'solid'}">
              <thead>
                <tr>
                    <th>Anno</th>
                    <th class="serie">Data 1</th>
                    <th class="serie">Data 2</th>
                    <th class="serie">Data 3</th>
                </tr>
              </thead>
              <tbody>
                <tr>
                    <th class="serie">2001</th>
                    <td>153</td>
                    <td>60</td>
                    <td>52</td>
                </tr>
                <tr>
                    <th class="serie">2002</th>
                    <td>113</td>
                    <td>70</td>
                    <td>60</td>
                </tr>
                <tr>
                    <th class="serie">2003</th>
                    <td>120</td>
                    <td>80</td>
                    <td>40</td>
                </tr>
              </tbody>
            </table>
            </div>
            <div class="example">
            <h3>Example 3</h3>
            <div class="code javascript"><!--jQuery(".jgtable").jgtable();--></div>
            <div class="code html"><!--<table class="jgtable {size:'500x250',
type:'p3',
title:'Example 4',
title_color:'28179b',
title_size:16,
colors:['a21a9c','FFCC00'],
bg:'FFFFFF',
bg_type:'gradient',
bg_angle:90,
bg_offset:'b7b4b4'}">--></div>
            <table class="jgtable {size:'500x250',
                                                type:'p3',
                                                title:'Example 4',
                                                title_color:'28179b',
                                                title_size:16,
                                                colors:['a21a9c','FFCC00'],
                                                bg:'FFFFFF',
                                                bg_type:'gradient',
                                                bg_angle:90,
                                                bg_offset:'b7b4b4'}">
              <thead>
                <tr>
                    <th>Anno</th>
                    <th class="serie">Data 4</th>
                    <th class="serie">Data 5</th>
                </tr>
              </thead>
              <tbody>
                <tr>
                    <th class="serie">2001</th>
                    <td>40</td>
                    <td>30</td>
                </tr>
                <tr>
                    <th class="serie">2000</th>
                    <td>30</td>
                    <td>40</td>
                </tr>
              </tbody>
            </table>
            </div>
            <div class="example">
            <h3>Example 4</h3>
            <div class="code javascript"><!--jQuery(".jgtable").jgtable();--></div>
            <div class="code html"><!--<table class="jgtable {size:'450x350',
type:'p',
title:'Example 5',
title_color:'28179b',
title_size:16,
colors:['a21a9c','FFCC00'],
bg:'FFFFFF',
bg_type:'gradient',
bg_angle:90,
bg_offset:'b7b4b4'}">--></div>
            <table class="jgtable {size:'450x350',
                                                type:'p',
                                                title:'Example 5',
                                                title_color:'28179b',
                                                title_size:16,
                                                colors:['a21a9c','FFCC00'],
                                                bg:'FFFFFF',
                                                bg_type:'gradient',
                                                bg_angle:90,
                                                bg_offset:'b7b4b4'}">
              <thead>
                <tr>
                    <th>Anno</th>
                    <th class="serie">Data 4</th>
                    <th class="serie">Data 5</th>
                </tr>
              </thead>
              <tbody>
                <tr>
                    <th class="serie">2001</th>
                    <td>40</td>
                    <td>30</td>
                </tr>
                <tr>
                    <th class="serie">2000</th>
                    <td>30</td>
                    <td>40</td>
                </tr>
              </tbody>
            </table>
            </div>
            <div class="example">
            <h3>Example 5</h3>
            <div class="code javascript"><!--jQuery(".jgtable").jgtable();--></div>
            <div class="code html"><!--<table class="jgtable {size:'550x450',
type:'lc',
colors:['f04242','FFCC00','99CC00'],
lines:[[12,9,7],[14,9,7],[13,9,7]],
bg:'dca0ee',
bg_type:'solid',
grid:true,
grid_x:3,
grid_y:3,
grid_line:0,
grid_blank:0}">--></div>
            <table class="jgtable {size:'550x450',
                                                type:'lc',
                                                colors:['f04242','FFCC00','99CC00'],
                                                lines:[[12,9,7],[14,9,7],[13,9,7]],
                                                bg:'dca0ee',
                                                bg_type:'solid',
                                                grid:true,
                                                grid_x:3,
                                                grid_y:3,
                                                grid_line:0,
                                                grid_blank:0}">
              <thead>
                <tr>
                    <th>Anno</th>
                    <th class="serie">Data 1</th>
                    <th class="serie">Data 2</th>
                    <th class="serie">Data 3</th>
                </tr>
              </thead>
              <tbody>
                <tr>
                    <th class="serie">2001</th>
                    <td>153</td>
                    <td>60</td>
                    <td>52</td>
                </tr>
                <tr>
                    <th class="serie">2002</th>
                    <td>113</td>
                    <td>70</td>
                    <td>60</td>
                </tr>
                <tr>
                    <th class="serie">2003</th>
                    <td>120</td>
                    <td>80</td>
                    <td>40</td>
                </tr>
              </tbody>
            </table>
            </div>
            <div class="example">
            <h3>Example 7</h3>
            <div class="code javascript"><!--jQuery(".jgtable").jgtable();--></div>
            <div class="code html"><!--<table class="jgtable {size:'550x450',
type:'bhs',
bar_width:90,
bar_spacing:11,
colors:['f04242','FFCC00','99CC00'],
bg:'dca0ee',
bg_type:'gradient',
bg_angle:40,
bg_offset:'FFFFFF',
chbg:'bfbfbf',
chbg_type:'stripes',
chbg_angle:0,
chbg_offset:'f5f5f5',
chbg_width:10}">--></div>
            <table class="jgtable {size:'550x450',
                                                type:'bhs',
                                                bar_width:90,
                                                bar_spacing:11,
                                                colors:['f04242','FFCC00','99CC00'],
                                                bg:'dca0ee',
                                                bg_type:'gradient',
                                                bg_angle:40,
                                                bg_offset:'FFFFFF',
                                                chbg:'bfbfbf',
                                                chbg_type:'stripes',
                                                chbg_angle:0,
                                                chbg_offset:'f5f5f5',
                                                chbg_width:10}">
              <thead>
                <tr>
                    <th>Anno</th>
                    <th class="serie">Data 1</th>
                    <th class="serie">Data 2</th>
                    <th class="serie">Data 3</th>
                </tr>
              </thead>
              <tbody>
                <tr>
                    <th class="serie">2001</th>
                    <td>153</td>
                    <td>60</td>
                    <td>52</td>
                </tr>
                <tr>
                    <th class="serie">2002</th>
                    <td>113</td>
                    <td>70</td>
                    <td>60</td>
                </tr>
                <tr>
                    <th class="serie">2003</th>
                    <td>120</td>
                    <td>80</td>
                    <td>40</td>
                </tr>
              </tbody>
            </table>
            </div>
            <div class="example">
            <h3>Example 8</h3>
            <div class="code javascript"><!--jQuery(".jgtable").jgtable();--></div>
            <div class="code html"><!--<table class="jgtable {size:'450x450',
type:'bvs',
bar_width:90,
bar_spacing:11,
colors:['f04242','FFCC00','99CC00'],
bg:'dca0ee',
bg_type:'gradient',
bg_angle:40,
bg_offset:'FFFFFF',
chbg:'bfbfbf',
chbg_type:'stripes',
chbg_angle:0,
chbg_offset:'f5f5f5',
chbg_width:10}">--></div>
            <table class="jgtable {size:'450x450',
                                                type:'bvs',
                                                bar_width:90,
                                                bar_spacing:11,
                                                colors:['f04242','FFCC00','99CC00'],
                                                bg:'dca0ee',
                                                bg_type:'gradient',
                                                bg_angle:40,
                                                bg_offset:'FFFFFF',
                                                chbg:'bfbfbf',
                                                chbg_type:'stripes',
                                                chbg_angle:0,
                                                chbg_offset:'f5f5f5',
                                                chbg_width:10}">
              <thead>
                <tr>
                    <th>Anno</th>
                    <th class="serie">Data 1</th>
                    <th class="serie">Data 2</th>
                    <th class="serie">Data 3</th>
                </tr>
              </thead>
              <tbody>
                <tr>
                    <th class="serie">2001</th>
                    <td>153</td>
                    <td>60</td>
                    <td>52</td>
                </tr>
                <tr>
                    <th class="serie">2002</th>
                    <td>113</td>
                    <td>70</td>
                    <td>60</td>
                </tr>
                <tr>
                    <th class="serie">2003</th>
                    <td>120</td>
                    <td>80</td>
                    <td>40</td>
                </tr>
              </tbody>
            </table>
            </div>
    
    </div>
    
    <div class="yslider-panelwrapper" title="Json">
        
        <h3>JS</h3>
        <div class="code javascript"><!--jQuery.getJSON(
    "../json/example.json",
    //wait json data
    function(json){
        jQuery("#jgjson").jgtable(json);
    }
);--></div>
        
        <h3>Options in external json file (../json/example.json)</h3>
        <div class="code javascript"><!--{
size:'550x400',
type:'bhg',
title:'Example 1',
title_color:'000000',
title_size:16,
bar_width:30,
bar_spacing:2,
colors:['5131c9','FFCC00','da1b1b'],
bg:'FFFFFF',
bg_type:'gradient',
bg_angle:90,
bg_offset:'6d6969',
grid:true,
grid_x:7,
grid_y:10,
grid_line:0,
grid_blank:0
}--></div>
        
        <h3>Html Table</h3>
        <div class="code html"><!--<table id="jgjson">
  <thead>
    <tr>
        <th>Anno</th>
        <th class="serie">Data 1</th>
        <th class="serie">Data 2</th>
        <th class="serie">Data 3</th>
    </tr>
  </thead>
  <tbody>
    <tr>
        <th class="serie">2001</th>
        <td>153</td>
        <td>60</td>
        <td>52</td>
    </tr>
    <tr>
        <th class="serie">2002</th>
        <td>113</td>
        <td>70</td>
        <td>60</td>
    </tr>
    <tr>
        <th class="serie">2003</th>
        <td>120</td>
        <td>80</td>
        <td>40</td>
    </tr>
  </tbody>
</table>--></div>
                                                
              <table id="jgjson">
              <thead>
                <tr>
                    <th>Anno</th>
                    <th class="serie">Data 1</th>
                    <th class="serie">Data 2</th>
                    <th class="serie">Data 3</th>
                </tr>
              </thead>
              <tbody>
                <tr>
                    <th class="serie">2001</th>
                    <td>153</td>
                    <td>60</td>
                    <td>52</td>
                </tr>
                <tr>
                    <th class="serie">2002</th>
                    <td>113</td>
                    <td>70</td>
                    <td>60</td>
                </tr>
                <tr>
                    <th class="serie">2003</th>
                    <td>120</td>
                    <td>80</td>
                    <td>40</td>
                </tr>
              </tbody>
            </table>
            
    </div>
    
    <div class="yslider-panelwrapper" title="Custom data">
        
        <h3>Alessandro Del Piero</h3>
        
        <table id="jgcustomdata">
          <thead>
            <tr>
            <th colspan="2">Cronologia</th>
            <th colspan="2">Campionato</th>
            <th colspan="2">Coppe di Lega<small><sup>*</sup></small></th>
            <th colspan="2">Coppe Europee<small><sup>**</sup></small></th>
            <th colspan="2">Coppe Internazionali<small><sup>***</sup></small></th>
            <th colspan="2">Totale</th>
          </tr>
          <tr>
            <th>Stagione - Squadra</th>
            <th>Serie</th>
            <th>Presenze</th>
            <th>Gol</th>
            <th>Presenze</th>
            <th>Gol</th>
            <th>Presenze</th>
            
            <th>Gol</th>
            <th>Presenze</th>
            <th>Gol</th>
            <th>Presenze</th>
            <th>Gol</th>
          </tr>
          </thead>
          <tfoot>
            <tr>
                <th colspan="2">Totale</th>
                <th>417</th>
                <th>176</th>
                <th>51</th>
                <th>22</th>
                <th>105</th>
                <th>43</th>
                <th>1</th>
                
                <th>1</th>
                <th>574</th>
                <th>242</th>
            </tr>
            </tfoot>
          <tbody>
          
          <tr>
            <th class="custom">1991-92 - Padova</th>
            
            <td>B</td>
            <td>4</td>
            <td>-</td>
            <td>-</td>
            <td>-</td>
            <td>-</td>
            <td>-</td>
            <td>-</td>
            <td>-</td>
            
            <td>4</td>
            <td>-</td>
            </tr>
            <tr>
            <th class="custom">1992-93 - Juventus</th>
            <td>B</td>
            <td>10</td>
            <td>1</td>
            
            <td>-</td>
            <td>-</td>
            <td>-</td>
            <td>-</td>
            <td>-</td>
            <td>-</td>
            <td>10</td>
            <td>1</td>
            </tr>
            
            <tr>
            <th class="custom">1993-94 - Juventus</th>
            <td>A</td>
            <td>11</td>
            <td>5</td>
            <td>1</td>
            <td>-</td>
            <td>2</td>
            
            <td>-</td>
            <td>-</td>
            <td>-</td>
            <td>14</td>
            <td>5</td>
            </tr>
            <tr>
            <th class="custom">1994-95 - Juventus</th>
            
            <td>A</td>
            <td>29</td>
            <td>8</td>
            <td>10</td>
            <td>1</td>
            <td>11</td>
            <td>1</td>
            <td>-</td>
            <td>-</td>
            
            <td>50</td>
            <td>10</td>
            </tr>
            <tr>
            <th class="custom">1995-96 - Juventus</th>
            <td>A</td>
            <td>29</td>
            <td>6</td>
            
            <td>3</td>
            <td>1</td>
            <td>11</td>
            <td>6</td>
            <td>-</td>
            <td>-</td>
            <td>43</td>
            <td>13</td>
            </tr>
            
            <tr>
            <th class="custom">1996-97 - Juventus</th>
            <td>A</td>
            <td>22</td>
            <td>8</td>
            <td>4</td>
            <td>-</td>
            <td>8</td>
            
            <td>6</td>
            <td>1</td>
            <td>1</td>
            <td>35</td>
            <td>15</td>
            </tr>
            <tr>
            <th class="custom">1997-98 - Juventus</th>
            
            <td>A</td>
            <td>32</td>
            <td>21</td>
            <td>5</td>
            <td>1</td>
            <td>10</td>
            <td>10</td>
            <td>-</td>
            <td>-</td>
            
            <td>47</td>
            <td>32</td>
            </tr>
            <tr>
            <th class="custom">1998-99 - Juventus</th>
            <td>A</td>
            <td>8</td>
            <td>2</td>
            
            <td>2</td>
            <td>1</td>
            <td>4</td>
            <td>-</td>
            <td>-</td>
            <td>-</td>
            <td>14</td>
            <td>3</td>
            </tr>
            
            <tr>
            <th class="custom">1999-00 - Juventus</th>
            <td>A</td>
            <td>34</td>
            <td>9</td>
            <td>2</td>
            <td>1</td>
            <td>9</td>
            
            <td>2</td>
            <td>-</td>
            <td>-</td>
            <td>45</td>
            <td>12</td>
            </tr>
            <tr>
            <th class="custom">2000-01 - Juventus</th>
            
            <td>A</td>
            <td>25</td>
            <td>9</td>
            <td>2</td>
            <td>-</td>
            <td>6</td>
            <td>-</td>
            <td>-</td>
            <td>-</td>
            
            <td>33</td>
            <td>9</td>
            </tr>
            <tr>
            <th class="custom">2001-02 - Juventus</th>
            <td>A</td>
            <td>32</td>
            <td>16</td>
            
            <td>4</td>
            <td>1</td>
            <td>10</td>
            <td>4</td>
            <td>-</td>
            <td>-</td>
            <td>46</td>
            <td>21</td>
            </tr>
            
            <tr>
            <th class="custom">2002-03 - Juventus</th>
            <td>A</td>
            <td>24</td>
            <td>16</td>
            <td>1</td>
            <td>2</td>
            <td>13</td>
            
            <td>5</td>
            <td>-</td>
            <td>-</td>
            <td>38</td>
            <td>23</td>
            </tr>
            <tr>
            <th class="custom">2003-04 - Juventus</th>
            
            <td>A</td>
            <td>22</td>
            <td>8</td>
            <td>5</td>
            <td>3</td>
            <td>4</td>
            <td>3</td>
            <td>-</td>
            <td>-</td>
            
            <td>31</td>
            <td>14</td>
            </tr>
            <tr>
            <th class="custom">2004-05 - Juventus</th>
            <td>A</td>
            <td>30</td>
            <td>14</td>
            
            <td>1</td>
            <td>-</td>
            <td>10</td>
            <td>3</td>
            <td>-</td>
            <td>-</td>
            <td>41</td>
            <td>17</td>
            </tr>
            
            <tr>
            <th class="custom">2005-06 - Juventus</th>
            <td>A</td>
            <td>33</td>
            <td>12</td>
            <td>5</td>
            <td>5</td>
            <td>7</td>
            
            <td>3</td>
            <td>-</td>
            <td>-</td>
            <td>45</td>
            <td>20</td>
            </tr>
            <tr>
            <th class="custom">2006-07 - Juventus</th>
            
            <td>B</td>
            <td>35</td>
            <td>20</td>
            <td>2</td>
            <td>3</td>
            <td>-</td>
            <td>-</td>
            <td>-</td>
            <td>-</td>
            
            <td>37</td>
            <td>23</td>
            </tr>
            
            <tr>
            <th class="custom">2007-08 - Juventus</th>
            <td>A</td>
            <td>37</td>
            <td>21</td>
            
            <td>4</td>
            <td>3</td>
            <td>-</td>
            <td>-</td>
            <td>-</td>
            <td>-</td>
            <td>41</td>
            <td>24</td>
            </tr>
            
            
            </tbody>
            
        </table>
        
        <h3>JS</h3>
        <div class="code javascript"><!--jQuery.getJSON(
"../json/delpiero.json",
//wait json data
function(json){
    var data_custom = [];
    for(var x= 0;x< jQuery("#jgcustomdata").find("tbody > tr").size();x++){
        data_custom.push(jQuery.map( jQuery("#jgcustomdata").find("tbody > tr:eq(" + x + ") > td"),
           function(td,index){
                if(index % 11 == 1 || index % 11 == 2){
                    if(parseInt(jQuery(td).text()))
                        return parseInt(jQuery(td).text());
                    else
                        return 0;
                } 
           }
        ));
        
    }
    var axis_custom = jQuery.map( jQuery("#jgcustomdata").find("tbody > tr > th.custom"),
               function(th) { return jQuery(th).text(); }
    );
    var legend_custom = ["presenze", "gol"];
    
    json.axis_labels = axis_custom;
    json.data = data_custom;
    json.legend = legend_custom;
    jQuery("#jgcustomdata").jgtable(json);
    
    var data_custom = [];
    for(var x= 0;x< jQuery("#jgcustomdata").find("tbody > tr").size();x++){
        data_custom.push(jQuery.map( jQuery("#jgcustomdata").find("tbody > tr:eq(" + x + ") > td"),
           function(td,index){
                if(index % 11 == 9 || index % 11 == 10){
                    if(parseInt(jQuery(td).text()))
                        return parseInt(jQuery(td).text());
                    else
                        return 0;
                } 
           }
        ));
        
    }
    json.data = data_custom;
    json.title = 'Gol e presenze totali';
    
    jQuery("#jgcustomdata").jgtable(json);
    
});--></div>
        
        <h3>Options in json file</h3>
        <div class="code javascript"><!--{
size:'450x600',
type:'bhg',
axis_step:1,
title:'Gol e presenze in campionato',
title_color:'000000',
title_size:16,
bar_width:10,
bar_spacing:0,
colors:['5131c9','da1b1b'],
grid:true,
grid_x:5,
grid_y:5,
grid_line:5,
grid_blank:5
}--></div>
        
        <h3>Html Table</h3>
        <div class="code html"><!--<table id="jgcustomdata">
  <thead>
    <tr>
    <th colspan="2">Cronologia</th>
    <th colspan="2">Campionato</th>
    <th colspan="2">Coppe di Lega<small><sup>*</sup></small></th>
    <th colspan="2">Coppe Europee<small><sup>**</sup></small></th>
    <th colspan="2">Coppe Internazionali<small><sup>***</sup></small></th>
    <th colspan="2">Totale</th>
  </tr>
  <tr>
    <th>Stagione - Squadra</th>
    <th>Serie</th>
    <th>Presenze</th>
    <th>Gol</th>
    <th>Presenze</th>
    <th>Gol</th>
    <th>Presenze</th>
    
    <th>Gol</th>
    <th>Presenze</th>
    <th>Gol</th>
    <th>Presenze</th>
    <th>Gol</th>
  </tr>
  </thead>
  <tfoot>
    <tr>
        <th colspan="2">Totale</th>
        <th>417</th>
        <th>176</th>
        <th>51</th>
        <th>22</th>
        <th>105</th>
        <th>43</th>
        <th>1</th>
        
        <th>1</th>
        <th>574</th>
        <th>242</th>
    </tr>
    </tfoot>
  <tbody>
  
  <tr>
    <th class="custom">1991-92 - Padova</th>
    
    <td>B</td>
    <td>4</td>
    <td>-</td>
    <td>-</td>
    <td>-</td>
    <td>-</td>
    <td>-</td>
    <td>-</td>
    <td>-</td>
    
    <td>4</td>
    <td>-</td>
    </tr>
    <tr>
    <th class="custom">1992-93 - Juventus</th>
    <td>B</td>
    <td>10</td>
    <td>1</td>
    
    <td>-</td>
    <td>-</td>
    <td>-</td>
    <td>-</td>
    <td>-</td>
    <td>-</td>
    <td>10</td>
    <td>1</td>
    </tr>
    
    <tr>
    <th class="custom">1993-94 - Juventus</th>
    <td>A</td>
    <td>11</td>
    <td>5</td>
    <td>1</td>
    <td>-</td>
    <td>2</td>
    
    <td>-</td>
    <td>-</td>
    <td>-</td>
    <td>14</td>
    <td>5</td>
    </tr>
    <tr>
    <th class="custom">1994-95 - Juventus</th>
    
    <td>A</td>
    <td>29</td>
    <td>8</td>
    <td>10</td>
    <td>1</td>
    <td>11</td>
    <td>1</td>
    <td>-</td>
    <td>-</td>
    
    <td>50</td>
    <td>10</td>
    </tr>
    <tr>
    <th class="custom">1995-96 - Juventus</th>
    <td>A</td>
    <td>29</td>
    <td>6</td>
    
    <td>3</td>
    <td>1</td>
    <td>11</td>
    <td>6</td>
    <td>-</td>
    <td>-</td>
    <td>43</td>
    <td>13</td>
    </tr>
    
    <tr>
    <th class="custom">1996-97 - Juventus</th>
    <td>A</td>
    <td>22</td>
    <td>8</td>
    <td>4</td>
    <td>-</td>
    <td>8</td>
    
    <td>6</td>
    <td>1</td>
    <td>1</td>
    <td>35</td>
    <td>15</td>
    </tr>
    <tr>
    <th class="custom">1997-98 - Juventus</th>
    
    <td>A</td>
    <td>32</td>
    <td>21</td>
    <td>5</td>
    <td>1</td>
    <td>10</td>
    <td>10</td>
    <td>-</td>
    <td>-</td>
    
    <td>47</td>
    <td>32</td>
    </tr>
    <tr>
    <th class="custom">1998-99 - Juventus</th>
    <td>A</td>
    <td>8</td>
    <td>2</td>
    
    <td>2</td>
    <td>1</td>
    <td>4</td>
    <td>-</td>
    <td>-</td>
    <td>-</td>
    <td>14</td>
    <td>3</td>
    </tr>
    
    <tr>
    <th class="custom">1999-00 - Juventus</th>
    <td>A</td>
    <td>34</td>
    <td>9</td>
    <td>2</td>
    <td>1</td>
    <td>9</td>
    
    <td>2</td>
    <td>-</td>
    <td>-</td>
    <td>45</td>
    <td>12</td>
    </tr>
    <tr>
    <th class="custom">2000-01 - Juventus</th>
    
    <td>A</td>
    <td>25</td>
    <td>9</td>
    <td>2</td>
    <td>-</td>
    <td>6</td>
    <td>-</td>
    <td>-</td>
    <td>-</td>
    
    <td>33</td>
    <td>9</td>
    </tr>
    <tr>
    <th class="custom">2001-02 - Juventus</th>
    <td>A</td>
    <td>32</td>
    <td>16</td>
    
    <td>4</td>
    <td>1</td>
    <td>10</td>
    <td>4</td>
    <td>-</td>
    <td>-</td>
    <td>46</td>
    <td>21</td>
    </tr>
    
    <tr>
    <th class="custom">2002-03 - Juventus</th>
    <td>A</td>
    <td>24</td>
    <td>16</td>
    <td>1</td>
    <td>2</td>
    <td>13</td>
    
    <td>5</td>
    <td>-</td>
    <td>-</td>
    <td>38</td>
    <td>23</td>
    </tr>
    <tr>
    <th class="custom">2003-04 - Juventus</th>
    
    <td>A</td>
    <td>22</td>
    <td>8</td>
    <td>5</td>
    <td>3</td>
    <td>4</td>
    <td>3</td>
    <td>-</td>
    <td>-</td>
    
    <td>31</td>
    <td>14</td>
    </tr>
    <tr>
    <th class="custom">2004-05 - Juventus</th>
    <td>A</td>
    <td>30</td>
    <td>14</td>
    
    <td>1</td>
    <td>-</td>
    <td>10</td>
    <td>3</td>
    <td>-</td>
    <td>-</td>
    <td>41</td>
    <td>17</td>
    </tr>
    
    <tr>
    <th class="custom">2005-06 - Juventus</th>
    <td>A</td>
    <td>33</td>
    <td>12</td>
    <td>5</td>
    <td>5</td>
    <td>7</td>
    
    <td>3</td>
    <td>-</td>
    <td>-</td>
    <td>45</td>
    <td>20</td>
    </tr>
    <tr>
    <th class="custom">2006-07 - Juventus</th>
    
    <td>B</td>
    <td>35</td>
    <td>20</td>
    <td>2</td>
    <td>3</td>
    <td>-</td>
    <td>-</td>
    <td>-</td>
    <td>-</td>
    
    <td>37</td>
    <td>23</td>
    </tr>
    
    <tr>
    <th class="custom">2007-08 - Juventus</th>
    <td>A</td>
    <td>37</td>
    <td>21</td>
    
    <td>4</td>
    <td>3</td>
    <td>-</td>
    <td>-</td>
    <td>-</td>
    <td>-</td>
    <td>41</td>
    <td>24</td>
    </tr>
    
    
    </tbody>
    
</table>--></div>
                                                
              
        
    </div>
</div>

<div id="yslider-code" class="ycodaslider">
    <a href="../../jgcharts.js">jGCharts 1.0</a>
    <a href="../../plugins/table/jgtable.js">jGTable 1.0</a>
    <!--a href="../../plugins/dashboard/dashboard.js">jGDashboard 1.0</a-->
    
</div>

<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">

</script>
<script type="text/javascript">
_uacct = "UA-258871-1";
urchinTracker();
</script>

</body>
</html>    